import React, { Component } from 'react';
import {
	StyleSheet, Text, View, Image
} from "react-native";
import { GLOBAL } from '../../../../config/global';
const scale = GLOBAL.SCALE;
/* 
fontLeft:{   // 左边文字设置
	title:'标题'  
	style:{}   // 自定义字体样式
}
fontLeft:{// 右边边文字设置

}
*/
const arrowLeft = require('../../../../imgs/arrow-left.png');

export class SpaceBetween extends Component {
	constructor(props) {
		super(props);
	}
	render () {
		let { fontLeft, fontRight, iconShow } = this.props;
		return (
			<View style={styles.listItem}>
				<View style={styles.listItemText}>
					<Text style={[styles.text, fontLeft.style || null]}>{fontLeft.title}</Text>
				</View>
				<View style={[styles.listItemText, { flex: 4, alignItems: 'flex-end' }]}>
					<Text style={[styles.text, fontRight.style || null]}>{fontRight.title}</Text>
				</View>
				{
					iconShow ?
						<View style={[{ alignItems: 'flex-end' }]}>
							<Image source={arrowLeft} style={styles.arrowLeft} />
						</View>
						: null
				}
			</View>
		)
	}
}
const styles = StyleSheet.create({
	listItem: {
		// height: 30 * scale,
		flexDirection: 'row',
		justifyContent: 'space-between',
		alignItems: 'center'
	},
	text: {
		fontSize: 12 * scale,
		color: '#222222'
	},
	listItemText: {
		flex: 2,
		flexWrap: 'wrap',
		justifyContent: 'space-between',
		padding: 6 * scale
	},
	arrowLeft: {
		width: 6 * scale,
		height: 11 * scale,
	},
})